<template>
    <div>
 <h2>房型修改</h2>
<table class="table">
<tbody>
    <tr>
        <td>房型名称</td>
        <td>
          <input type="text" v-model="model.HouseName">
        </td>
    </tr>


    <tr>
        <td>面积</td>
        <td>
            <input type="text" v-model="model.HouseMianJi">
        </td>
    </tr>


    <tr>
        <td>是否有窗</td>
        <td>
            <input type="radio" name="iswn" value="1" v-model="model.InWin">有
            <input type="radio" name="iswn" value="0"  v-model="model.InWin">无
        </td>
    </tr>

    <tr>
        <td>价格</td>
        <td>
            <input type="text" v-model="model.Price">
        </td>
    </tr>


    <tr>
        <td>入住人数</td>
        <td>
            <input type="text" v-model="model.Num">
        </td>
    </tr>

    <tr>
        <td>状态</td>
        <td>
            <input type="radio" name="state" value="1"  v-model="model.State">上架
            <input type="radio" name="state" value="0" v-model="model.State">下架
        </td>
    </tr>

    <tr>
        <td>入住时间</td>
        <td>
            <input type="date" v-model="model.CreateTime">
        </td>
    </tr>


    <tr>
        <td></td>
        <td>
            <input type="button" value="修改" class="btn  btn-success" @click="ok">
        </td>
    </tr>
</tbody>
</table>

    </div>
</template>

<script setup lang="ts">
import axios from 'axios';
import { ref,reactive, onMounted } from 'vue';
import { useRoute,useRouter } from 'vue-router';
const route=useRoute();
const router=useRouter();


let model=reactive({
Id: route.query.Id,
  "HouseName": '',
  "HouseMianJi": '',
  "InWin": 1,
  "Price": '',
  "Num": '',
  "State": 1,
  "CreateTime": '',
})


//反填
onMounted(()=>{
GetAll();


})

const GetAll=()=>{
axios({
url:'https://localhost:7229/api/House/HouseAll',
method:'get',
 params:{
 Id: route.query.Id,
},
    
})
.then((res)=>{
console.log(res);
  model.HouseName=res.data.HouseName;
  model.HouseMianJi=res.data.HouseMianJi;
  model.InWin=res.data.InWin;
  model.Price=res.data.Price;
  model.Num=res.data.Num; 
  model.State=res.data.State;
  model.CreateTime=res.data.CreateTime.substring(0,10);
})
    
.catch((ree)=>{
console.log(ree);
})
    










}













const ok=()=>{
if(model.HouseName==""){
    alert('房型名称不能为空');
    return;
}

if(model.HouseMianJi==""){
    alert('房型面积不能为空');
    return;
}


if(isNaN(Number(model.HouseMianJi))==true){
    alert('面积必须是数字');
    return;
}


if(model.Price==""){
    alert('价格不能为空');
    return;
}

if(isNaN(Number(model.Price))==true){
    alert('价格必须是数字');
    return;
}



if(model.Num==""){
    alert('入住人数不能为空');
    return;
}



axios({
url:'https://localhost:7229/api/House/HouseUpd',
method:'put',
data:model,

})
.then((res)=>{

    console.log(res);
    if(res.data>0){
        alert('修改成功')
        router.push('/HouseList');
        return;
        
    }

    else{
        alert('修改失败')
        return;
    }
})


.catch((ree)=>{

console.log(ree);
})





}



</script>

<style scoped>

</style>